<html>

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<link rel="icon" type="image/png" href="img/favicon.ico">
	<title>Tools Collection</title>
	<link rel="stylesheet" href="../layui/css/layui.css">
	<script type="text/javascript" src="../layui/layui.js" charset="utf-8"></script>
	<script type="text/javascript" src="../static/file2hex.js" charset="utf-8"></script>
</head>

<body>
	<div class="layui-nav top layui-bg-green">
		<div>
			<a href="/"><img src="../static/img/logolh.png" alt="logo" style="height: 62px;"></a>
		</div>
		<div style="margin-left:50px;">
			<ul>
				<li class="layui-nav-item layui-this">
					<a href="javascript:;" style="font-size: 20px;">文件转HEX</a>
					<dl class="layui-nav-child">
						<dd><a href="/file2hex">文件转HEX</a></dd>
						<dd><a href="/delete_note">删除注释</a></dd>
						<dd><a href="/img2bin">图片转bin</a></dd>
						<dd><a href="/chart">曲线</a></dd>
						<dd><a href="/ttf2bin">字体生成bin</a></dd>
					</dl>
				</li>
				<li class="layui-nav-item">
					<a href="javascript:;" style="font-size: 20px;">预留</a>
					<dl class="layui-nav-child">
						<dd><a href="">预留</a></dd>
						<dd><a href="">预留</a></dd>
						<dd class="layui-this"><a href="">预留</a></dd>
						<dd><a href="">预留</a></dd>
					</dl>
				</li>
				<li class="layui-nav-item"><a href="http://git.armcloudiot.com/" style="font-size: 20px;">mygit</a></li>
				<li class="layui-nav-item"><a href="http://cloudreve.armcloudiot.com/" style="font-size: 20px;">云盘</a>
				</li>
				<li class="layui-nav-item"><a href="http://leanote.armcloudiot.com/" style="font-size: 20px;">云笔记</a>
				</li>
			</ul>
		</div>
	</div>
	<div class="layui-col-md-offset1" style="margin-top: 50px;">
		<div class="layui-input-block">
			<textarea name="receive" placeholder="结果" class="layui-textarea"
				style="height:400px;width:900px;border:1px solid #0990D2;border-radius:10px;padding:10px;font-family:宋体"
				id="Content"></textarea>
		</div>
		<div style="margin-top: 15px; margin-left: 700px;">
			<button type="button" class="layui-btn" id="test1">
				<i class="layui-icon">&#xe67c;</i>上传文件</button>
		</div>
	</div>

	<div class="layui-row">
		<div class="layui-col-sd3 layui-col-md-offset9" style="margin-top: 500px;">
			<div class="grid-demo"><a href="http://www.beian.gov.cn/" target="_blank"> 公安交互式论坛备案：苏ICP备19045320号-1 </a>
			</div>
		</div>
	</div>
</body>

<style>
	.top {
		display: flex;
		margin: auto;
	}

	/* 	.layui-nav * {
		font-size: 24px
	}
	 */
	.layui-form-checkbox[lay-skin=primary] {
		height: 25px !important;
		line-height: normal !important;
		min-width: 18px;
		min-height: 18px;
		border: none !important;
		margin-right: 0;
		padding-left: 28px;
		padding-right: 0;
		background: 0 0
	}
</style>

<script>
	function Bytes2HexString(arrBytes) {
		var str = "";
		var tmp;
		var num = arrBytes;
		if (num < 0) {
			//此处填坑，当byte因为符合位导致数值为负时候，需要对数据进行处理
			tmp = (255 + num + 1).toString(16);
		} else {
			tmp = num.toString(16);
		}
		if (tmp.length == 1) {
			tmp = "0" + tmp;
		}
		str += tmp;
		return str;
	}

	layui.use('upload', function () {
		var $ = layui.jquery,
			upload = layui.upload;

		//上传文件
		var uploadInst = upload.render({
			elem: '#test1',
			url: '/file2hexpost', //改成您自己的上传接口
			accept: 'file', //允许上传的文件类型
			// exts: 'png|gif|jpg|jpeg|zip|rar',//文件扩展名 
			before: function (obj) {
				//预读本地文件示例，不支持ie8
				obj.preview(function (index, file, result) {
					str = "unsigned char const buf[] = {\r\n";
					cnt = 0;
					const view = new DataView(result);
					for (i = 0; i < view.byteLength; i++) {
						str += "0x";
						str += Bytes2HexString(view.getInt8(i));
						str += ", "
						cnt++;
						if (cnt % 15 == 0) {
							str += "\r\n";
						}
					}
					str += "};";
					$("#Content").val(str)
				});
			},
			done: function (res) {
				//如果上传失败
				if (res.code > 0) {
					return layer.msg('上传失败');
				}
				//上传成功
			},
			error: function () {
				//演示失败状态，并实现重传
				// var demoText = $('#demoText');
				// demoText.html(
				// 	'<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
				// demoText.find('.demo-reload').on('click', function() {
				// 	uploadInst.upload();
				// });
			}
		});
	});
</script>

<script>
	var index = 0;
	var data = [];

	layui.use('element', function () {
		var element = layui.element;
		//一些事件监听
		element.on('tab(demo)', function (data) {
			index = data.index
			console.log(index);
		});
	});

	//一般直接写在一个js文件中
	layui.use(['form', 'layedit', 'laydate'], function () {
		var layer = layui.layer,
			form = layui.form;
		var $ = layui.$;

		// 清空发送区
		$("#button1").click(function () {

			var str = $("#Content").val();
			// console.log(str);
			$.ajax({
				url: "/deleteNotePost",
				type: "POST",
				data: str,
				dataType: "json",
				success: function (rsp) {
					layer.msg("发送成功");
					// console.log(rsp);
					if (rsp) { // 检查返回的数据中是否包含content字段
						$("#Content").val(rsp.message); // 更新#Content的值
					}
				}
			});
		});
	});
</script>

</html>